import * as echarts from '../../ec-canvas/echarts';
var ec_bar = require('ec_line.js')
var ec_pie = require('ec_pie.js')
import { Request } from "../../utils/request.js"
var request = new Request()

var xAxisData = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23]
var stData = []
var etData = []
var ptData = []
var pieData = [{ name: "暂无", value: 100 }]

// var startX, endX;
// var moveFlag = true;// 判断执行滑动事件
Page({
  data: {
    ecBar: {
    },
    ecPie: {
    },
    //默认导航栏索引
    TabCur: 0,
    CalModel: false,
    cellValue: 0,
    days: [], //存放一个月的天数数组
    cur_year: 0, //年
    cur_month: 0, //月
    cur_day: 0,//日
  },
  onLoad: function (options) {

  },
  onReady: function () {

  },
  onShow() {
    //获取当前年月
    const date = new Date();
    var _cur_year = date.getFullYear();
    var _cur_month = date.getMonth() + 1;
    var _cur_day = date.getDate();
    var weeks_ch = ['日', '一', '二', '三', '四', '五', '六'];
    this.setData({
      cur_year: _cur_year,
      cur_month: _cur_month,
      cur_day: _cur_day,
      weeks_ch: weeks_ch,
    })
    // 计算当月1号前空了几个格子，把它填充在days数组的前面
    this.calculateEmptyGrids(this.data.cur_year, this.data.cur_month);
    this.calculateDays(this.data.cur_year, this.data.cur_month);
    this.showToday();
    this.getDayData()

    this.barComponent = this.selectComponent('#chartbar');
    this.pieComponent = this.selectComponent('#chartpie');
  },
  //导航栏索引更换
  //getData
  tabSelect(e) {
    this.setData({
      TabCur: e.currentTarget.dataset.id,
      scrollLeft: (e.currentTarget.dataset.id - 1) * 60
    })
    if (this.data.TabCur == 0) {
      this.chart_bar.clear();
      this.chart_pie.clear();
      this.getDayData()
    } else if (this.data.TabCur == 1) {
      this.chart_bar.clear();
      this.chart_pie.clear();
      this.getWeekData()
    } else if (this.data.TabCur == 2) {
      this.chart_bar.clear();
      this.chart_pie.clear();
      this.getMonthData()
    }
  },

  initBar(title, yAxisName, xAxisData, stData, etData, ptData) {
    this.barComponent.init((canvas, width, height) => {
      const chart = echarts.init(canvas, null, {
        width: width,
        height: height,
      });
      ec_bar.setOption(chart, title, yAxisName, xAxisData, stData, etData, ptData);
      this.chart_bar = chart;
    });
  },
  initPie: function (title, pieData) {
    this.pieComponent.init((canvas, width, height) => {
      const chart = echarts.init(canvas, null, {
        width: width,
        height: height,
      });
      ec_pie.setOption(chart, title, pieData);
      this.chart_pie = chart;
    });
  },
  getDayData() {
    var that = this
    xAxisData
    var openId = wx.getStorageSync('openId')
    var today = this.data.cur_year + "-" + "0" + this.data.cur_month + "-" + this.data.cur_day

    request.get("getTodayInformation/" + openId + "/" + today, {},
      function (res) {
        console.log(res)
        if (res.statusCode != 200) {
          that.initBar("日学习时长", "分钟(min)", xAxisData, stData, etData, ptData);
          that.initPie("学习时间分布", pieData)
          return;
        } else {
          var data = res.data.result
          var xAxis = data.line.xaria
          var st = data.line.stData
          var et = data.line.etData
          var pt = []
          for(var i = 0;i<=23;i++){
            pt[i] = data.line.ptData[i].toFixed(2)
          }
          console.log(pt)

          that.initBar("日学习时长", "分钟(min)", xAxis, st, et, pt);
          that.initPie("学习时间分布", data.pie)
        }
      })
  },

  getWeekData() {
    var that = this
    var openId = wx.getStorageSync('openId')
    var startDate = this.data.cur_year + "-" + "0" + this.data.cur_month + "-" + (this.data.cur_day - 3)
    var endDate = this.data.cur_year + "-" + "0" + this.data.cur_month + "-" + (this.data.cur_day + 3)

    request.get("getWeekInformation/" + startDate + "/" + endDate + "/" + openId, null,
      function (res) {
        console.log(res)
        if (res.statusCode != 200) {
          that.initBar("周学习时长", "小时(h)", xAxisData, stData, etData, ptData);
          //that.initPie("学习时间分布", pieData)
          return;
        } else {
          var data = res.data.result
          var xAxis = data.line.xaria
          var st = data.line.stData
          var et = data.line.etData
          var pt = []
          for(var i = 0;i<=6;i++){
            pt[i] = data.line.ptData[i].toFixed(2)
          }
          console.log(pt)

          that.initBar("周学习时长", "小时(h)", xAxis, st, et, pt);
          //that.initPie("学习时间分布", res.data.result.pie)
        }

      })
  },
  getMonthData() {
    var that = this
    var openId = wx.getStorageSync('openId')
    var toyear = this.data.cur_year
    var tomonth = this.data.cur_month
    request.get("getMoonInformation/" + toyear + "/" + tomonth + "/" + openId, null,
      function (res) {
        console.log(res)
        if (res.statusCode != 200) {
          that.initBar("月学习时长", "小时(h)", xAxisData, stData, etData, ptData);
          that.initPie("学习时间分布", pieData)
          return;
        }else{
          var data = res.data.result
          var xAxis = data.line.xaria
          var st = data.line.stData
          var et = data.line.etData
          var pt = []

          for(var i = 0;i<data.line.ptData.length;i++){
            pt[i] = data.line.ptData[i].toFixed(2)
          }

          console.log(pt)

          that.initBar("月学习时长", "小时(h)", xAxis, st, et, pt);
          //that.initPie("学习时间分布", res.data.result.pie)
        }
      })
  },

  showCalModel() {
    if (this.data.CalModel == true) {
      this.setData({
        CalModel: false
      });
    }
    else if (this.data.CalModel == false) {
      this.setData({
        CalModel: true
      });
    }
  },
  hideCalModel() {
    this.setData({
      CalModel: false
    });
  },

  onClickDay(e) {
    var date = parseInt(e.currentTarget.id)
    this.setData({
      cellValue: e.currentTarget.id,
      cur_day: date
    })
  },

  onConfirm() {
    if(this.data.TabCur >= 0){
      this.setData({
        TabCur:0
      })
      this.chart_bar.clear();
      this.chart_pie.clear();
      this.getDayData();
      this.hideCalModel()
    }
  },

  // 获取当月共多少天
  getThisMonthDays: function (year, month) {
    return new Date(year, month, 0).getDate()
  },

  // 获取当月第一天星期几
  getFirstDayOfWeek: function (year, month) {
    return new Date(Date.UTC(year, month - 1, 1)).getDay();
  },

  // 计算当月1号前空了几个格子，把它填充在days数组的前面
  calculateEmptyGrids: function (year, month) {
    var that = this;
    //计算每个月时要清零
    that.setData({
      days: [],
    });
    const firstDayOfWeek = this.getFirstDayOfWeek(year, month);
    if (firstDayOfWeek > 0) {
      for (let i = 0; i < firstDayOfWeek; i++) {
        var obj = {
          date: null,
          today: false,
        }
        that.data.days.push(obj);
      }
      this.setData({
        days: that.data.days,
      });
      //清空
    } else {
      this.setData({
        days: []
      });
    }
  },

  // 绘制当月天数占的格子，并把它放到days数组中
  calculateDays: function (year, month) {
    var that = this;
    const thisMonthDays = this.getThisMonthDays(year, month);
    for (let i = 1; i <= thisMonthDays; i++) {
      var obj = {
        date: i,
        today: false,
      }
      that.data.days.push(obj);
    }
    this.setData({
      days: that.data.days
    });
  },

  // 切换控制年月，上一个月，下一个月
  handleCalendar: function (e) {
    var that = this;
    const handle = e.currentTarget.dataset.handle;
    const cur_year = that.data.cur_year;
    const cur_month = that.data.cur_month;

    if (handle === 'prev') {
      let newMonth = cur_month - 1;
      let newYear = cur_year;
      if (newMonth < 1) {
        newYear = cur_year - 1;
        newMonth = 12;
      }
      this.setData({
        cur_year: newYear,
        cur_month: newMonth
      })
      this.calculateEmptyGrids(newYear, newMonth);
      this.calculateDays(newYear, newMonth);
      this.showToday();
    } else {

      let newMonth = cur_month + 1;
      let newYear = cur_year;
      if (newMonth > 12) {
        newYear = cur_year + 1;
        newMonth = 1;
      }
      this.setData({
        cur_year: newYear,
        cur_month: newMonth
      })

      this.calculateEmptyGrids(newYear, newMonth);
      this.calculateDays(newYear, newMonth);
      this.showToday();
    }
  },
  showToday() {
    var that = this;
    var daysArr = that.data.days;
    var todate = new Date();
    for (var i = 0; i < daysArr.length; i++) {
      if (that.data.cur_year == todate.getFullYear() && that.data.cur_month == todate.getMonth() + 1 && daysArr[i].date == todate.getDate()) {
        daysArr[i].today = true;
      }
    }
    that.setData({
      days: daysArr
    });
  }

  /*
    touchStart: function (e) {
    startX = e.touches[0].pageX; // 获取触摸时的原点
    moveFlag = true;
  },
  // 触摸移动事件
  touchMove: function (e) {
    endX = e.touches[0].pageX; // 获取触摸时的原点
    if (moveFlag) {
      if (endX - startX > 50) {
        console.log("move right");
        this.move2right();
        moveFlag = false;
      }
      if (startX - endX > 50) {
        console.log("move left");
        this.move2left();
        moveFlag = false;
      }
    }

  },
  // 触摸结束事件
  touchEnd: function (e) {
    moveFlag = true; // 回复滑动事件
  },

  move2left() {
    var that = this;
    this.handleCalendar()
  },
  move2right() {
    var that = this;
    this.handleCalendar()
  },
   */
})